<template>
  <s-table
      ref="table"
      :data="loadData"
      :loading="isLoading"
      :pageSize="15"
      rowKey="id"
  >
    <a-table-column key="walletId" align="center" data-index="walletId" title="钱包编号"/>
    <a-table-column key="title" align="center" data-index="title" title="关联业务标题"/>
    <a-table-column key="price" align="center" data-index="price" title="交易金额">
      <template #default="text">
        <span>{{ text | price }}</span>
      </template>
    </a-table-column>
    <a-table-column key="balance" align="center" data-index="balance" title="钱包余额">
      <template #default="text">
        <span>{{ text | price }}</span>
      </template>
    </a-table-column>
    <a-table-column key="creationTime" align="center" data-index="creationTime" title="交易时间">
      <template #default="text">
        <span>{{ text | moment }}</span>
      </template>
    </a-table-column>
  </s-table>
</template>

<script>
import * as WalletApi from '@/api/pay/wallet'
import * as Api from '@/api/pay/wallet-transaction'
import {STable} from '@/components/Table'

export default {
  name: 'Index',
  components: {
    STable
  },
  props: {
    walletId: {
      type: [String, Number],
      default: undefined
    },
    uid: {
      type: [String, Number],
      default: undefined
    }
  },
  data() {
    return {
      queryParam: {},
      isLoading: false,
    }
  },
  methods: {
    async loadData(param) {
      let walletId = this.walletId
      if (this.uid) {
        const wallet = await WalletApi.detailByUid(this.uid)
        walletId = wallet.id
      }
      this.queryParam.walletId = walletId
      return Api.page({...param, ...this.queryParam})
    }
  }
}
</script>

<style lang="less" scoped>
.ant-card-body {
  padding: 22px 29px 25px;
}

.order-font {
  padding: 2px 0;
  font-size: 12px;
}
</style>